<?php
use yii\bootstrap\BootstrapAsset;
BootstrapAsset::register($this);

use backend\modules\statistics\assets\EchartsAsset;
EchartsAsset::register($this);
?>

<style>
    .row{
        margin-right: 0;
        margin-left: 0;
    }
</style>

<div class="content margin_top_foot">
    <header class="header fixed_top bg_mx_green">
        <div class="back_text" onclick="javascript:history.back(-1)"><div class="arrow_left"></div>返回</div>仔猪状态分布
        <div class="header_icon">
            <span class="iconfont icon-home"></span>
        </div>
    </header>
    <div class="margin_b_10 relative">
        <section class="wrapper site-min-height">
            <!-- page start-->
            <section class="panel">
                <div class="row">
                    <div class="col-md-10 col-md-offset-1">
                        <table class="table table-hover" style="margin-top: 10px;">
                            <tbody>
                            <tr>
                                <th>
                                    村
                                </th>
                                <th>
                                    贫困数
                                </th>
                                <th>
                                    总数
                                </th>
                                <th>
                                    贫困占比
                                </th>
                            </tr>
                            <?php foreach ($fdata as $key => $row) { ?>
                                <tr>
                                    <td>
                                        <?= $row['name'] ?>
                                    </td>
                                    <td>
                                        <?= array_key_exists($row['name'],$poor)?$poor[$row['name']]:0; ?>
                                    </td>
                                    <td>
                                        <?= $row['value'] ?>
                                    </td>
                                    <td>
                                        <?= array_key_exists($row['name'],$poor)?round(($poor[$row['name']]/$row['value'])*100,2):0; ?>%
                                    </td>
                                </tr>
                            <?php } ?>
                            </tbody>
                        </table>
                    </div>
                </div>
                <!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
                <div class="row" style="margin-top:30px;">
                    <div class="col-md-4 col-md-offset-1">
                        <div id="pinkun" style="margin: ;height: 700px;width: 100%;"></div>
                    </div>
                    <div class="col-md-4 col-md-offset-1">
                        <div id="cunnum" style="margin: ;height: 700px;width: 100%;"></div>
                    </div>
                </div>
            </section>
        </section>
    </div>
    <div class="user_navs grid_3 bg_white"></div>
    <!--<footer class="foot_tab fixed_bottom mx_green font_16"></footer>-->
</div>





<script>
    <?php $this->beginBlock('pinkun') ?>

    loadheadbar("农户统计");


    var option = {
        title: {
            text: '各村贫困户数量比对',
            subtext: '牧心农业',
            left: 'center'
        },
        tooltip : {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c}户 ({d}%)"
        },
        legend: {
            // orient: 'vertical',
            // top: 'middle',
            bottom: 10,
            left: 'center',
            data: <?php echo json_encode($poorname,JSON_UNESCAPED_UNICODE)?>,
        },
        series : [
            {
                type: 'pie',
                radius : '65%',
                center: ['50%', '50%'],
                selectedMode: 'single',
                data:<?php echo json_encode($poordata,JSON_UNESCAPED_UNICODE)?>,
                itemStyle: {
                    emphasis: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
        ]
    };




    var optioncun = {
        title: {
            text: '各村农户总数比对',
            subtext: '牧心农业',
            left: 'center'
        },
        tooltip : {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c}户 ({d}%)"
        },
        legend: {
            // orient: 'vertical',
            // top: 'middle',
            bottom: 10,
            left: 'center',
            data: <?php echo json_encode($name,JSON_UNESCAPED_UNICODE)?>,
        },
        series : [
            {
                type: 'pie',
                radius : '65%',
                center: ['50%', '50%'],
                selectedMode: 'single',
                data:<?php echo json_encode($fdata,JSON_UNESCAPED_UNICODE)?>,
                itemStyle: {
                    emphasis: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
        ]
    };


    // 基于准备好的dom，初始化echarts实例
    var myChart = echarts.init(document.getElementById('pinkun'));
    myChart.setOption(option);


    var myChartcun = echarts.init(document.getElementById('cunnum'));
    myChartcun.setOption(optioncun);

    <?php $this->endBlock('pinkun') ?>
    <?php $this->registerJs($this->blocks['pinkun'],\yii\web\View::POS_END) ?>

</script>
